<template>
	<view class="ftc ft12 loading" :style="{backgroundColor: loadingBgColor}">
		<view class="flex flex-ac flex-pc" :hidden="loadingComplete" :style="{color: loadingColor}">
			<view class="btn-loading-inner btn-loading-gray" :style="{borderColor: loadingColor}"></view>
			<view class="pt1 ft12">{{loadingText}}</view>
		</view>
		<view class="ft12" :hidden="!loadingComplete" :style="{color: loadingCompleteColor}">{{loadingCompleteText}}</view>
	</view>
</template>

<script>
	export default {
		props: {
			loadingComplete: {
				type: Boolean,
				default: false
			},
			loadingText: {
				type: String,
				default: '正在载入更多...'
			},
			loadingCompleteText: {
				type: String,
				default: '没有更多了'
			},
			loadingColor: {
				type: String,
				default: '#666'
			},
			loadingCompleteColor: {
				type: String,
				default: '#999'
            },
            loadingBgColor: {
                type: String,
                default: '#fff'
            }

		},
		data() {
			return {

			};
		}
	}
</script>

<style>
	.loading{ height:96rpx; line-height:96rpx;}
</style>
